<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<meta content="" name="keywords">
<meta content="" name="description">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>添加标签</title>
<link href="./css/style.css" rel="stylesheet" type="text/css">
<style type="text/css">
html {
    /*font-family: 'STHeiti', 'Microsoft YaHei', 'SimSun', Arial;*/
    font-size: 20px;
    color: #000;
    background-color: #efefef;
}
.input-tag {
    border: 0px solid #CCC;
    border-radius: 0.85rem;
    font-size: 0.9rem;
    padding-top: 0.15rem;
    padding-bottom: 0.15rem;
    padding-left: 0.15rem;
    width: 100%;
    line-height: 1.65rem;
    margin-top: 1.2rem;
    background-color: #FFF;
    color: #CACACA;
}
.d_tags {
    margin-top: 1.775rem;
    margin-bottom: 2rem;
}

.d_tags a {
    border-radius: 0.5rem;
    border: 1px solid #CCC;
    color: #C8C8C8;
    display: inline-block;
    margin: 0 0.65rem 0.65rem 0;
    padding: 0.35rem;
    font-size:0.65rem;
    line-height: 1.4rem;
}

.tips {
    text-align: center;
    font-size: 0.6rem;
    color: #B5B5B5;
}
</style>

</head>

<body class="common-pading-wrap">

	<!-- 标签输入框 -->
	<form id="addTagFrom" action="#">
		<input id="tagKey" type="text" name="tagKey" class="input-tag"
			placeholder="例如：清热解毒">
	</form>

	<!-- 流式布局标签 -->
	<div class="d_tags">
	   <a href="#">祛脂降压</a>
	   <a href="#">护心</a>
	   <a href="#">解毒</a>
	   <a href="#">养肝</a>
	   <a href="#">消食</a>
	   <a href="#">利水消肿</a>
	   <a href="#">补肾虚</a>
	   <a href="#">清热除火</a>
	   <a href="#">生津止渴</a>
	   <a href="#">化痰止咳</a>
	   <a href="#">平喘</a>
	   <a href="#">抑癌抗瘤</a>
	   <a href="#">补充能量</a>
	</div>

	<!-- 提示信息 -->
	<div class="tips">选择或输入您想要添加的食谱功效标签</div>

	<!-- 添加按钮 -->
	<div id="btn_submit" class="btn_submit">
		<span>添加</span>
	</div>
</body>

<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<script src="./js/autofit.js" ></script>

</html>